<template>
    <div class="multiSearch">
        <template>
            <el-input
                v-model="text"
                clearable
                placeholder="请输入文件名或备注进行搜索"
                @clear="clear"
            ></el-input>
            <el-button type="primary" @click="searchFile">查询</el-button>
        </template>
    </div>
</template>
<script>
export default {
  name: 'multiSearch',
  props: {},
  data () {
    return {
      text: ''
    }
  },
  computed: {},
  components: {},
  watch: {},
  mounted () {},
  methods: {
    searchFile () {
      this.$emit('on-search', this.text)
    },
    clear () {
      this.$emit('on-clear')
    }
  }
}
</script>
<style lang="styl">
.multiSearch {
    display: flex;
    align-items: center;
    width: 328px;

    .el-input {
        margin-right: 6px;
    }

    .el-input__icon {
        line-height: 32px;
    }

    .el-input__inner {
        height: 32px;
        line-height: 32px;
        font-size: 12px;
    }

    .el-button {
        border-radius: 4px;
        background: #16336c;
        border-color: #16336c;
        color: #fff;
        height: 32px;
        text-align: center;
    }
}
</style>
